<!-- 门店中心页 -->
<template>
	<view v-if="shenheStatus == 0" class="md-center">
		<view class="header-bg"></view>
		
		<view class="headerStyle">
			<view class="headerStyle_icon" @click="goNext()">
				<u-icon size="36rpx" name="arrow-left"></u-icon>
			</view>
			<view class="csgCenter">
				门店中心
			</view>
		</view>
		
		
		<view class="header-section">
			<view class="md-info">
				<view class="" style="display: flex; align-items: center;">
					<view class="" @click="goStoreSettings">
						<view class="dian"></view>
						<view class="dian mt6"></view>
						<view class="dian mt6"></view>
					</view>
					<view class="md-logo ml14">
						<image :src="mdInfo.cover_url" mode="aspectFill" />
					</view>
					<view class="info-left ml20">
						<view class="name">{{ mdInfo.name }}</view>
						<view class="time">{{ $t("shop.startTime") }}：{{ openTime }}</view>
					</view>
				</view>
				<view v-if="mdInfo.open_status==1" class="trade bgF" >
					<u-icon size="30rpx" color="#12B315" name="checkmark-circle-fill"></u-icon>
					<text class="ml6">营业中</text>
				</view>
				<view v-if="mdInfo.open_status==0" class="trade bgF">
					<u-icon size="30rpx" color="#F0250E" name="minus-circle-fill"></u-icon>
					<text class="ml6">已打烊</text>
				</view>
			</view>
			
			<!-- 自提订单 -->
			<view class="selfPickup">
				<view class="ml24 pt24 nameStyle">
					自提订单
				</view>
				<view class="df_j_a " style="margin-top: 50rpx;">
					<view class="tc" @click="goSelf(0)">
						<view class="selfPickup_num">
							{{mdInfo.offline_order.not_send}}
						</view>
						<view class="selfPickup_state">
							待发货
						</view>
					</view>
					<view class="tc" @click="goSelf(2)">
						<view class="selfPickup_num">
							{{mdInfo.offline_order.send}}
						</view>
						<view class="selfPickup_state">
							待自提
						</view>
					</view>
					<view class="tc" @click="goSelf(4)">
						<view class="selfPickup_num">
							{{mdInfo.offline_order.wait_sale}}
						</view>
						<view class="selfPickup_state">
							待售后
						</view>
					</view>
					<view class="tc" @click="goSelf(3)">
						<view class="selfPickup_num">
							{{mdInfo.offline_order.confirm}}
						</view>
						<view class="selfPickup_state">
							已完成
						</view>
					</view>
				</view>
			</view>
			<!-- 门店订单 -->
			<view class="selfPickup mt30">
				<view class="ml24 pt24 nameStyle">
					门店订单
				</view>
				<view class="df_j_a" style="margin-top: 50rpx;">
					<view class="tc" @click="goMdOrder(1)">
						<view class="selfPickup_num">
							{{mdInfo.all_order.not_send}}
						</view>
						<view class="selfPickup_state">
							待发货
						</view>
					</view>
					<view class="tc" @click="goMdOrder(3)">
						<view class="selfPickup_num">
							{{mdInfo.all_order.send}}
						</view>
						<view class="selfPickup_state">
							待收货
						</view>
					</view>
					<view class="tc" @click="goMdOrder(5)">
						<view class="selfPickup_num">
							{{mdInfo.all_order.wait_sale}}
						</view>
						<view class="selfPickup_state">
							待售后
						</view>
					</view>
					<view class="tc" @click="goMdOrder(4)">
						<view class="selfPickup_num">
							{{mdInfo.all_order.confirm}}
						</view>
						<view class="selfPickup_state">
							已完成
						</view>
					</view>
				</view>
			</view>

           <!-- 提现 -->
		 <view class="selfPickup2 mt30"  >
		 	<view class="df_j_a " style="padding-top: 40rpx;" >
		 		<view class="tc" @click="gotoCommission(2)">
					<view class="selfPickup_state_2">
						<text class="mr10">可提现</text> (元)
					</view>
		 			<view class="selfPickup_num_2 mt5">
		 				{{mdInfo.cash_profit}}
		 			</view>
		 		</view>
		 		<view class="tc">
		 			<view class="selfPickup_state_2">
		 				<text class="mr10">已提现</text> (元)
		 			</view>
		 			<view class="selfPickup_num_2 mt5">
		 				{{mdInfo.cash}}
		 			</view>
		 		</view>
		 		<view class="tc" @click="gotoCommission(1)">
		 			<view class="selfPickup_state_2">
		 				<text class="mr10">未结算</text> (元)
		 			</view>
		 			<view class="selfPickup_num_2 mt5">
		 				{{mdInfo.not_send_profit}}
		 			</view>
		 		</view>
		 	</view>
			
			<view class="price-btn" @click.stop="gotoWithDraw">立即提现</view>
			
		 </view>
		   
		   <!-- 原代码 -->
			<!-- <view class="store-data" @click="gotoCommission">
				<view class="data-top">
					<view class="price-data">
						<view class="label-title">
							<text>可提现佣金</text>
							<u-icon size="24" color="#262626" name="arrow-right"></u-icon>
						</view>
						<view class="price-box">
							<text>¥</text>
							<text>{{ mdInfo.cash_profit | priceBeforeZero }}</text>
							<text>{{ mdInfo.cash_profit | priceAfterZero }}</text>
						</view>
					</view>
					<view class="price-btn" @click.stop="gotoWithDraw">立即提现</view>
				</view>
				<view class="data-down">
					<view class="data-item">
						<view class="item-label">{{ $t("mdAdmin.sales") }}</view>
						<view class="item-price">¥{{ mdInfo.pay_profit || 0 }}</view>
					</view>
					<view class="split-line"></view>
					<view class="data-item">
						<view class="item-label">核销佣金</view>
						<view class="item-price">¥{{ mdInfo.clerk_profit || 0 }}</view>
					</view>
					<view class="split-line"></view>
					<view class="data-item">
						<view class="item-label">{{ $t("mdAdmin.profit") }}</view>
						<view class="item-price">¥{{ mdInfo.sale_profit || 0 }}</view>
					</view>
				</view>
			</view> -->
		</view>
		<!-- 更多功能 -->
		<view class="moreList">
			更多功能
		</view>
		<view class="md-tools">
			<view class="tools-item" v-for="(item, index) in toolsList" :key="index" @click="handleToolItem(item)">
				<image :src="item.img" mode="aspectFill" />
				<text>{{ item.text }}</text>
			</view>
		</view>
		<!-- 独立运营功能 -->
		<view class="" v-if="mdInfo.is_single==1">
			<view class="moreList1">
				独立运营功能
			</view>
			<view class="md-tools">
				<view class="tools-item" v-for="(item, index) in independence" :key="index" @click="handleToolItem1(item)">
					<image :src="item.img" mode="aspectFill" />
					<text>{{ item.text }}</text>
				</view>
			</view>
		</view>
	</view>
	<Shenhe v-else-if="shenheStatus == 1"></Shenhe>
</template>

<script>
	import Shenhe from "@/components/shenhe/shenhe";
	import ziti from "../images/ziti.png";
	import saoma from "../images/saoma.png";
	import tuiguang from "../images/tuiguang.png";
	import dianpu from "../images/dianpu.png";
	import yuangong from "../images/yuangong.png";
	import zhanghu from "../images/zhanghu.png";
	import dingdan from "../images/dingdan.png";
	import shangpin from "../images/shangpin.png";
	import {
		log
	} from "util";


	export default {
		components: {
			Shenhe
		},
		data() {
			return {
				mdInfo: {},
				id:null,
				// 更多功能
				toolsList: [
					// 自提订单
					{
						img: ziti,
						text: this.$t("mdAdmin.offline"),
						link: "/md_admin/md-center/self-mention?status=-1",
					},
					// 扫码核销
					{
						img: saoma,
						text: this.$t("mdAdmin.clerk"),
						link: "",
						action: "scan",
					},
					// 推广二维码
					{
						img: tuiguang,
						text: '推广二维码',
						link: `/md_admin/md-center/promotionER`,
					},
					// 店铺设置
					{
						img: dianpu,
						text: '店铺设置',
						link: "/md_admin/md-center/setting",
					},
					// 员工管理
					{
						img: yuangong,
						text: this.$t("mdAdmin.staff"),
						link: "/md_admin/staff-center/staff-list",
					},
					// 提现记录
					{
						img: zhanghu,
						text: "账户提现",
						link: "/md_admin/md-center/cash-summary",
					}
					// // 用户管理
					// {
					//    img: userConfigImg,
					//    text: this.$t("mdAdmin.user"),
					//    link: "/md_admin/md-center/user-list",
					// },

				],
				// 独立运营功能
				independence: [
					// 订单管理
					{
						img: dingdan,
						text: this.$t("admin.orderManagement"),
						link: "/md_admin/md-center/md-order",
					},
					// 商品管理
					{
						img: shangpin,
						text: "商品管理",
						link: `/md_admin/md-center/commodityManagement`,
					},

				],
				requestEnd: false,
			};
		},
		filters: {
			priceBeforeZero(val) {
				if (!val) return "";
				if (val.indexOf(".") < 0) return `${val}.`;
				return val.substr(0, val.indexOf("."));
			},
			priceAfterZero(val) {
				if (!val) return "";
				if (val.indexOf(".") < 0) return "00";
				return val.substr(val.indexOf("."), val.length);
			},
		},
		computed: {
			openTime() {
				if (!this.mdInfo?.id) return "";
				if (this.mdInfo.open_status == 0) return "已打烊";
				if (this.mdInfo.shop_time_type == 0) {
					return "全天营业";
				} else {
					return this.mdInfo.start_time + "-" + this.mdInfo.end_time;
				}
			},
		},
		onLoad(t) {},
		onShow() {
			this.getMdCenterData();
		},
		watch: {},
		methods: {
			goSelf(val){
				uni.navigateTo({
					url:`/md_admin/md-center/self-mention?status=${val}`
				})
			},
			goMdOrder(val){
				uni.navigateTo({
					url:`/md_admin/md-center/md-order?status=${val}`
				})
			},
			// 回到主页
			goNext(){
				uni.navigateBack()
			},
			// 点击三个点跳转店铺设置页面、
			goStoreSettings(){
				this.$utils.toUrl('/md_admin/md-center/setting');
			},
			getMdCenterData() {
				this.$allrequest.mdAdmin
					.getMdCenterData({}, true)
					.then((res) => {
						if (!res.code) {
							this.mdInfo = res.data;
							this.id=this.mdInfo.id

						} else {
							uni.showToast({
								title: res.msg,
								icon: "none",
							});
							setTimeout(() => {
								uni.navigateBack();
							}, 1500);
						}
					})
					.catch((err) => {
						uni.showToast({
							title: err.msg,
							icon: "none",
						});
						setTimeout(() => {
							uni.navigateBack();
						}, 1500);
					});
			},
			// 去提现
			gotoWithDraw() {
				if (this.mdInfo.cash_profit <= 0) {
					uni.showToast({
						title: this.$t("mdAdmin.noMore"),
						icon: "none",
					});
					return;
				}
				this.$utils.toUrl(`/md_admin/withdraw/index`);
			},
			gotoCommission(val) {
				this.$utils.toUrl(`/md_admin/md-center/commission-list?status=${val}`);
			},
			handleToolItem(item) {
				if (item?.action) {
					if (item.action == "scan") {
						this.scanQrcode();
						return;
					}
				}
				this.$utils.toUrl(item.link);
			},
			// 独立运营
			handleToolItem1(item) {
				if (item?.action) {
					if (item.action == "scan") {
						this.scanQrcode();
						return;
					}
				}
				if(this.mdInfo.is_single==1){
					if(item.text=='商品管理'){
						uni.navigateTo({
							url:`/md_admin/md-center/commodityManagement?id=${this.id}`
						})
						return
					}
					if(item.text=='订单管理'){
						uni.navigateTo({
							url:`/md_admin/md-center/md-order?id=${this.id}`
						})
						return
					}
					this.$utils.toUrl(item.link);
				}else{
					uni.showToast({
						icon:'error',
						title: '您没有权限访问!',
						duration: 1500
					});
					return
				}
				
			},
			scanQrcode() {
				this.$utils.toUrl("", "clerk");
			},
		},
	};
</script>

<style lang="scss" scoped>
	.headerStyle_icon{
		position: absolute;
		min-height: 9.5vh;
		top: 108rpx;
		left: 32rpx;
		z-index: 1;
	}
	.csgCenter{
		font-family: PingFang SC, PingFang SC;
		font-weight: 600;
		font-size: 36rpx;
		color: rgba(0,0,0,0.94);
		font-style: normal;
		text-transform: none;
	}
	.headerStyle{
		display: flex;
		justify-content: center;
		align-items: center;
		width: 750rpx;
		padding-top: 100rpx;
		position: relative;
		z-index: 1;
	}
	.mt30{
		margin-top: 30rpx !important;
	}
	.mr10{
		margin-right: 10rpx;
	}
	.mt5{
		margin-top: 5rpx;
	}
	.selfPickup_state{
		height: 32rpx;
		font-family: PingFang SC, PingFang SC;
		font-weight: 400;
		font-size: 22rpx;
		color: #8C8C8C;
		font-style: normal;
		text-transform: none;
	}
	.selfPickup_num{
		height: 50rpx;
		font-family: PingFang SC, PingFang SC;
		font-weight: 600;
		font-size: 36rpx;
		color: #262626;
		font-style: normal;
		text-transform: none;
	}
	.selfPickup_num_2{
		height: 48rpx;
		font-family: PingFang SC, PingFang SC;
		font-weight: 600;
		font-size: 34rpx;
		color: #262626;
		font-style: normal;
		text-transform: none;
	}
	.selfPickup_state_2{
		height: 34rpx;
		font-family: PingFang SC, PingFang SC;
		font-weight: 400;
		font-size: 24rpx;
		color: #262626;
		font-style: normal;
		text-transform: none;
	}
	.nameStyle{
		width: 112rpx;
		height: 40rpx;
		font-family: PingFang SC, PingFang SC;
		font-weight: 600;
		font-size: 28rpx;
		color: #262626;
		font-style: normal;
		text-transform: none;
	}
	.tc{
		text-align: center;
	}
	.pt24{
		padding-top: 24rpx;
	}
	.ml24{
		margin-left: 24rpx;
	}
	.selfPickup{
		width: 92vw;
		margin: 0 auto;
		border-radius: 30rpx;
		background-color: #FFF;
		height: 204rpx;
		margin-top: 16rpx;
	}
	.selfPickup2{
		width: 92vw;
		margin: 0 auto;
		border-radius: 30rpx;
		background-color: #FFF;
		height: 274rpx;
	}
	.df_j_a{
		display: flex;
		justify-content: space-around;
		align-items: center;
	}
	.ml6 {
		margin-left: 6rpx;
	}
	.bgF{
		background-color: #FFF;
	}

	.trade {
		padding: 10rpx 20rpx;
		border-radius: 120rpx;
		font-weight: 400;
		font-size: 24rpx;
		font-family: PingFang SC, PingFang SC;
		display: flex;
		justify-content: flex-end;
		align-items: center;
	}
	.trade1 {
		width: 150rpx;
		padding: 10rpx 20rpx 10rpx 20rpx;
		border-radius: 120rpx;
		font-weight: 400;
		font-size: 24rpx;
		font-family: PingFang SC, PingFang SC;
	}
	.gf{
		display: flex;
		justify-content: flex-end;
		align-items: center;
		width: 92vw;
		margin: 0 auto;
	}

	.ml14 {
		margin-left: 14rpx;
	}

	.dian {
		width: 6rpx;
		height: 6rpx;
		background-color: #262626;
	}

	.mt6 {
		margin-top: 6rpx;
	}
	.price-btn {
		width: 622rpx;
		height: 80rpx;
		background: #F0250E;
		border-radius: 120rpx 120rpx 120rpx 120rpx;
		display: flex;
		justify-content: center;
		align-items: center;
		font-size: 30rpx;
		font-family: PingFang SC;
		font-weight: 600;
		color: #ffffff;
		margin: 40rpx 30rpx auto;
	}

	.moreList1 {
		height: 40rpx;
		font-family: PingFang SC, PingFang SC;
		font-weight: 600;
		font-size: 28rpx;
		color: #262626;
		font-style: normal;
		text-transform: none;
		margin-left: 32rpx;
	}
	.moreList {
		height: 40rpx;
		font-family: PingFang SC, PingFang SC;
		font-weight: 600;
		font-size: 28rpx;
		color: #262626;
		font-style: normal;
		text-transform: none;
		margin-left: 32rpx;
		margin-top: 30rpx;
	}

	.ml20 {
		margin-left: 20rpx;
	}

	.md-center {
		width: 100%;
		min-height: 100vh;
		background: #F5F4F4;
		position: relative;
		.header-bg {
			width: 100%;
			height: 340rpx;
			background-image: url('../images/bg1.png');
			position: absolute;
			z-index: 1;
			left: 0;
			top: 0;
		}

		.header-section {
			width: 100%;
			position: relative;
			z-index: 1;
			padding-top: 40rpx;

			.md-info {
				width: 92vw;
				height: 80rpx;
				margin: 0 auto;
				position: relative;
				display: flex;
				align-items: center;
				justify-content: space-between;

				.info-left {
					.name {
						font-size: 30rpx;
						font-family: PingFang SC, PingFang SC;
						font-weight: 600;
						color: #262626;
						max-width: 66vw;
						white-space: nowrap;
						overflow: hidden;
						text-overflow: ellipsis;
						display: inline-block;
					}

					.time {
						font-size: 24rpx;
						font-family: PingFang SC;
						font-weight: 400;
						color: #8C8C8C;
					}
				}

				.md-logo {
					width: 80rpx;
					height: 80rpx;
					border-radius: 50%;
					background-color: #ffffff;
					overflow: hidden;

					image {
						width: 100%;
						height: 100%;
						display: block;
					}
				}
			}

			.store-data {
				width: 92vw;
				margin: 24rpx auto 0;
				background: #ffffff;
				box-shadow: 0px 6rpx 24rpx rgba(0, 0, 0, 0.03);
				border-radius: 20rpx;

				.data-top {
					display: flex;
					padding: 40rpx 30rpx 40rpx 50rpx;
					align-items: flex-end;
					justify-content: space-between;
					border-bottom: 1px solid #f8f8f8;

					.price-data {
						.label-title {
							display: flex;
							align-items: center;

							text {
								font-size: 30rpx;
								font-family: PingFang SC;
								font-weight: 600;
								color: #262626;
							}
						}

						.price-box {
							display: flex;
							align-items: baseline;
							color: #262626;
							font-weight: 600;
							font-family: PingFang SC;

							text:nth-child(1) {
								font-size: 24rpx;
							}

							text:nth-child(2) {
								font-size: 48rpx;
							}

							text:nth-child(3) {
								font-size: 24rpx;
							}
						}
					}
				}

				.data-down {
					display: flex;
					padding: 20rpx 0rpx 16rpx 0rpx;
					align-items: center;
					justify-content: space-between;

					.data-item {
						width: 33.3%;
						display: flex;
						flex-direction: column;
						align-items: center;

						.item-label {
							font-size: 24rpx;
							font-family: PingFang SC;
							font-weight: 400;
							color: #262626;
						}

						.item-price {
							font-size: 26rpx;
							font-family: PingFang SC;
							font-weight: 600;
							color: #262626;
						}
					}

					.split-line {
						width: 1px;
						height: 30rpx;
						background: #f8f8f8;
					}
				}
			}
		}

		.md-tools {
			width: 92vw;
			margin: 24rpx auto 0;
			display: flex;
			flex-wrap: wrap;

			.tools-item {
				width: 20%;
				display: flex;
				flex-direction: column;
				justify-content: center;
				align-items: center;
				margin-bottom: 36rpx;

				image {
					width: 50rpx;
					height: 50rpx;
					display: block;
				}

				text {
					font-size: 24rpx;
					font-family: PingFang SC;
					font-weight: 400;
					color: #262626;
					display: inline-block;
					margin-top: 20rpx;
				}
			}
		}
	}
</style>